package com.riaevolution.components
{
	import flash.text.TextFormat;
	
	import mx.core.Container;
	import mx.core.UITextField;
	import mx.formatters.DateBase;
	
	/**
	 * CalendarRender muestra una linda vista de un UI al estilo calendario
	 * de escritorio.
	 * 
	 * @example
	 * <listing>
	 * 
	 * &lt;local:CalendarRender currentDate="{new Date()}"/&gt;
	 * &lt;style&gt;
	 * CalendarRender
	 * {
	 * 	fontFamily:Corbel;
	 * 	fontSize:18;
	 * 	dayMarginTop:20;
	 * 	dayFontSize:100;
	 * 	dayFontFamily:Segoe;
	 * 	backgroundColor:#0066CC;
	 * 	color:#FFFFFF;
	 * 	borderStyle:solid;
	 * 	cornerRadius:4;
	 * 	dropShadowEnabled:true;
	 * 	shadowDirection:right;
	 * }
	 * &lt;/style&gt;
	 * </listing>
	 */
	public class CalendarRender extends Container
	{
		public function CalendarRender()
		{
			super();
			currentDate = new Date();
		}
		
		private var _currentDateChanged:Boolean = true;
		private var _currentDate:Date;

		/**
		 * return the value date to display 
		 */
		public function get currentDate():Date
		{
			return _currentDate;
		}

		/**
		 * Especify the value date to display 
		 */
		public function set currentDate(value:Date):void
		{
			_currentDate = value;
			_currentDateChanged = true;
			invalidateProperties();
		}
		
		override protected function resourcesChanged() : void {
			super.resourcesChanged();
			_currentDateChanged = true;
			invalidateProperties();
		}
		
		override protected function commitProperties() : void {
			super.commitProperties();
			if(_currentDateChanged && _dateTxt && _dayTxt && _monthTxt && this.currentDate) {
				_currentDateChanged = false;
				_dateTxt.text = DateBase.dayNamesLong[this.currentDate.getDay()];
				_dayTxt.text = this.currentDate.getDate().toString();
				_monthTxt.text = DateBase.monthNamesLong[this.currentDate.getMonth()] + " "+ this.currentDate.getFullYear();
				
				_dateTxt.setTextFormat(getTextFormat(0));
				_dayTxt.setTextFormat(getTextFormat(1));
				_monthTxt.setTextFormat(getTextFormat(2));
				
				invalidateDisplayList();
			}
		}
		
		
		override protected function measure() : void {
			super.measure();
			var size:Number = 180;
			measuredMinWidth = size;
			measuredMinHeight = size;
			measuredWidth = size;
			measuredHeight = size;
		}
		
		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number) : void {
			super.updateDisplayList(unscaledWidth, unscaledHeight);
			
			var gap:int = parseInt(this.getStyle("dayMarginTop"));
			_dayTxt.x = (unscaledWidth - _dayTxt.textWidth - 6) / 2;
			_dayTxt.y = (unscaledHeight - _dayTxt.textHeight - gap) / 2;
			
			_dateTxt.x = (unscaledWidth - _dateTxt.textWidth - 4) / 2;
			_dateTxt.y = 6;
			
			_monthTxt.x = (unscaledWidth - _monthTxt.textWidth - 8) / 2;
			_monthTxt.y = unscaledHeight - _monthTxt.textHeight - 6;
		}
		
		private var _dayTxt:UITextField;
		private var _dateTxt:UITextField;
		private var _monthTxt:UITextField;
		
		protected function getTextFormat(textArea:int):TextFormat {
			var uit:TextFormat = new TextFormat(this.getStyle("fontFamily"),null,this.getStyle("color"));
			switch(textArea) {
				case 0://el dia lunes, martes, etc
				case 2://el mes/ año
					uit.bold = true;
					uit.size = getStyle("fontSize");
					break;
				case 1: //el numero de dia
					uit.font = getStyle("dayFontFamily");
					uit.size = getStyle("dayFontSize");
					break;
			}
			return uit;
		}
		
		protected function createTextField():UITextField {
			var uit:UITextField = new UITextField();
			uit.autoSize = "left";
			uit.styleName = this;
			//uit.borderColor = 0xff3300;
			return uit;
		}
		
		override protected function createChildren() : void {
			super.createChildren();
			
			_dayTxt = createTextField();
			_dateTxt = createTextField();
			_monthTxt = createTextField();
			
			addChild(_dateTxt);
			addChild(_dayTxt);
			addChild(_monthTxt);
		}
	}
}